<template>
  <div>
    <img class="red-package" src="/images/红包.png" alt="" />
    <div class="sidebar">
      <a @click="goProfile">
        <img src="/images/用户中心.png" alt="" />
        <a>用户中心</a>
      </a>
      <a @click="goCart">
        <img src="/images/购物车.png" alt="" />
        <a>购物车</a>
      </a>
      <a @click="goCollect">
        <img src="/images/收藏.png" alt="" />
        <a>我的收藏</a>
      </a>
      <a href="#">
        <img src="/images/置顶.png" alt="" />
        <label>返回顶部</label>
      </a>
    </div>
  </div>
</template>

<script>
export default {
  name: "HeGangProjectKeepRight",

  data() {
    return {};
  },

  mounted() {},

  methods: {
    goProfile() {
      this.$router.push({
        path: "/mall/profile/information",
      });
    },
    goCart() {
      this.$router.push({
        path: "/mall/shopcart",
      });
    },
    goCollect() {
      this.$router.push({
        path: "/mall/profile/myFavorite/doteyCollect",
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.red-package {
  width: 90px;
  height: 95px;
  position: fixed;
  right: 0px;
  top: 35%;
}

.sidebar {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  position: fixed;
  right: 10px;
  top: 50%;
  font-size: 13px;
  background-color: white;
  width: 60px;
  height: 330px;

  img {
    width: 20px;
    height: 20px;
  }

  a {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
}
</style>
